<!--
 * @Descripttion: 文件说明
 * @version: 0.0.1
 * @Author: sunchangshun
 * @Date: 2021-02-18 07:58:07
 * @LastEditors: sunchangshun
 * @LastEditTime: 2021-04-13 16:41:21
-->
<template>
  <div class="messageList">
    <div class="body-row">
      <div class="value col1">序号</div>
      <div class="value col4">设备编码</div>
      <div class="value col4">设备名称</div>
      <div class="value col3">报警编号</div>
      <div class="value col3">报警类型</div>
      <div class="value col4">报警原因</div>
      <div class="value col2">报警时长</div>
    </div>
    <seamlessTable
      v-if="MyChart"
      :data="MyChart"
      :class-option="option_order"
    >
      <div class="body-row" v-for="(item, index) in MyChart" :key="index">
        <div class="value col1">{{ index + 1 }}</div>
        <div class="value col4">{{ item.EquipmentId }}</div>
        <div class="value col4">{{ item.EquipmentName }}</div>
        <div class="value col3">{{ item.WarringID }}</div>
        <div class="value col3">{{ item.WarringType }}</div>
        <div class="value col4">{{ item.WarringBe }}</div>
        <div class="value col2">{{ item.WarringDate }}</div>
      </div>
    </seamlessTable>
  </div>
</template>
<script>
import * as echarts from "echarts";
export default {
  data() {
    return {
      saleList: null,
      MyChart: [{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      },{
        'EquipmentId': 'ZZJ007',
        'EquipmentName': '底侧梁加强板焊-2 201号机',
        'WarringID': '',
        'WarringType': '',
        'WarringBe': '101#机器人焊机故障',
        'WarringDate': '2小时18分27秒',
      }
      ]
    };
  },
  mounted() {
    this.getChart()
  },
  methods: {
    getChart() {

    }
  },
computed: {
  option_order() {
    return {
      limitMoveNum: 7,
      singleHeight: 44, // 行高  开启后停顿
      waitTime: 1000, // 等待时间
      hoverStop: true, // 禁止鼠标悬停
    };
  },
},
};
</script>
<style lang="scss" scoped>
.messageList {
  height: 100%;
  width: 100%;
  .body-title {
    background: linear-gradient(90deg, #27316f 0%, rgba(13, 18, 42, 0.6) 100%);
  }
  .body-row {
    height: 40px;
    display: flex;
    align-items: center;
    padding-right: 60px;
    padding-left: 20px;
    margin: 3px 0;
    color: #a8adbf;
    font-size: 1.1rem;
    .value {
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
      word-break: break-all;
      text-align: center;
    }
    .col1 {
      width: 80px;
    }
    .col2 {
      flex: 1;
      text-align: left !important;
    }
    .col3 {
      width: 260px;
    }
    .col4 {
      width: 230px;
    }
    &:nth-of-type(odd) {
      background: linear-gradient(
        90deg,
        rgba(13, 18, 42, 0.2) 0%,
        rgba(13, 18, 42, 0.2) 100%
      );
    }
  }
}
</style>
